/* mine/pages/animation/demo10/index.wxss */

.swiper-box {
	position: relative;
	margin-top: 32rpx;
	box-sizing: border-box;
	max-width: 750rpx;
	height: 420rpx;
	overflow: hidden;

	.item-box {
		position: absolute;
		width: 300rpx;
		height: 380rpx;
		top: 0;
		bottom: 0;
		left: 50%;
		margin: auto;
		box-shadow: 0px 13rpx 12rpx rbga(0, 0, 0, .2);
		border-radius: 15rpx;
		overflow: hidden;
		transition: all .2s ease-in 0s;
		opacity: 1;
		transform: scale(calc(0.5 + var(--index)/10));
		margin-left: calc(var(--left) * 100rpx - 150rpx);
		z-index: var(--index);
	}

	.none {
		opacity: 0;
	}
}

.swiper-item {
	width: 100%;
	height: 100%;
	border-radius: 6rpx;
	overflow: hidden;

	image,
	video {
		display: block;
		margin: 0;
		width: 100%;
		height: 100%;
		pointer-events: none;
	}

	image {
		max-width: 100%;
		display: inline-block;
		position: relative;
		z-index: 0;
	}
}